<div mt-layout="{ spacing_open: 0, west__size: 300 }" style="width: 100%; height: 100%;">

<div class="ui-layout-west" style="padding: 0" mt-layout="{ spacing_open: 0 }" ng-controller="myMenuGroupTreeController">
    <div class="ui-layout-center" style="padding: 0">
        <select class="form-control" ng-model="$root.selectedSystemId">
        <option value="DM">DM</option>
        <option value="DA">DA</option>
        <option value="DP">DP</option>
    </select>
        <div class="fuelux" mt-url="tmpl/menuGroupTree.html"></div>
    </div>
    <div class="ui-layout-south" style="border-bottom: none; border-right: none">
        <button class="btn btn-primary" href="#addMenuGroupTab" aria-controls="addMenuGroupTab" role="tab" data-toggle="tab" mt-tab>新建组</button>&nbsp;
        <button class="btn btn-primary" href="#modifyMenuGroupTab" aria-controls="modifyMenuGroupTab" role="tab" data-toggle="tab"
            mt-tab ng-disabled="!selectedMenuGroup">修改组</button>&nbsp;
        <button class="btn btn-primary" data-toggle="modal" data-target="#myModal" aria-controls="deleteMenuGroup" ng-disabled="!selectedMenuGroup" mt-tab>删除组</button>
    </div>
</div>

<div class="ui-layout-center">

    <!-- Nav tabs -->
    <ul class="nav nav-tabs hidden" role="tablist">
        <li role="presentation" class="active"><a href="#helpTab" aria-controls="helpTab" role="tab" data-toggle="tab" mt-tab>帮助</a></li>
        <li role="presentation"><a href="#menuItemListTab" aria-controls="menuItemListTab" role="tab" data-toggle="tab" mt-tab>菜单树</a></li>
        <li role="presentation"><a href="#addMenuGroupTab" aria-controls="addMenuGroupTab" role="tab" data-toggle="tab">新建菜单</a></li>
        <li role="presentation"><a href="#modifyMenuGroupTab" aria-controls="modifyMenuGroupTab" role="tab" data-toggle="tab">修改菜单</a></li>
    </ul>

    <!-- Tab panes -->
    <div class="tab-content">

        <div role="tabpanel" class="tab-pane fade active in" id="helpTab">请选择菜单项</div>

        <div role="tabpanel" class="tab-pane fade" id="menuItemListTab" ng-controller="myMenuGroupTableController">
            <div class="ui-layout-north">
                <ol class="breadcrumb">
                    <li>系统管理</li>
                    <li><a href="../../settings/menu">系统菜单管理</a></li>
                    <li class="active">详细信息</li>
                </ol>
            </div>
            <div class="ui-layout-center" mt-url="tmpl/menuItemlist.html"></div>
            <div class="ui-layout-south">
                <button class="btn btn-primary" href="#addMenuTab" aria-controls="addMenuTab" role="tab" data-toggle="tab" mt-tab>新建菜单项</button>
                <button class="btn btn-primary" href="#modifyMenuTab" aria-controls="modifyMenuTab" role="tab" data-toggle="tab" ng-disabled="!selectedMenu.length" mt-tab>修改菜单项</button>
                <button class="btn btn-primary" data-toggle="modal" data-target="#myModal2" aria-controls="deleteMenuGroup" ng-disabled="!selectedMenu.length" mt-tab>删除菜单项</button>
            </div>
        </div>

        <div role="tabpanel" class="tab-pane fade" id="addMenuGroupTab" ng-controller="addMenuGroupController">
            <ol class="breadcrumb">
                <li>系统管理</li>
                <li><a href="../../settings/menu">系统菜单管理</a></li>
                <li class="active">新建菜单组</li>
            </ol>
            <div mt-url="tmpl/menuGroupEditor.html"></div>
        </div>

        <div role="tabpanel" class="tab-pane fade" id="modifyMenuGroupTab" ng-controller="modifyMenuGroupController">
            <ol class="breadcrumb">
                <li>系统管理</li>
                <li><a href="../../settings/menu">系统菜单管理</a></li>
                <li class="active">修改菜单组</li>
            </ol>
            <div mt-url="tmpl/menuGroupInfo.html"></div>
        </div>

        <div role="tabpanel" class="tab-pane fade" id="addMenuTab" ng-controller="addMenuController">
            <div class="ui-layout-north">
                <ol class="breadcrumb">
                    <li>系统管理</li>
                    <li><a href="../../settings/menu">系统菜单管理</a></li>
                    <li class="active">新建菜单项</li>
                </ol>
            </div>
            <div class="ui-layout-center" mt-url="tmpl/addMenuTable.html"></div>
        </div>
        <div role="tabpanel" class="tab-pane fade" id="modifyMenuTab" ng-controller="modifyMenuController">
            <div class="ui-layout-north">
                <ol class="breadcrumb">
                    <li>系统管理</li>
                    <li><a href="../../settings/menu">系统菜单管理</a></li>
                    <li class="active">修改菜单项</li>
                </ol>
            </div>
            <div class="ui-layout-center" mt-url="tmpl/addMenuTable.html"></div>
        </div>

    </div>

</div>
</div>

<div mt-url="tmpl/menuGroupDeleteDlg.html" ng-controller="deleteMenuGroupController"></div>
<div mt-url="tmpl/menuRemoveDlg.html" ng-controller="deleteMenuController"></div>
